<!DOCTYPE html>
<html>
<head>
	<meta content="text/html;charset=UTF-8"/>
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
	<meta http-equiv ="Pragma" content = "no-cache"/>
	<meta http-equiv="Cache-Control" content="no cache" />
	<meta http-equiv="Expires" content="0" />
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
	<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
	<meta name="apple-mobile-web-app-capable" content="yes"/>
	<meta name="format-detection" content="telephone=no"/>
	<script src="https://cdn.bootcss.com/pace/1.0.2/pace.min.js"></script>
	<link href="https://cdn.bootcss.com/pace/1.0.2/themes/pink/pace-theme-flash.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="../../plugins/layui/css/layui.css" media="all"/>
	<link rel="stylesheet" type="text/css" href="../../css/fs.css" media="all"/>
	<script type="text/javascript" src="../../plugins/jquery/jquery.min.js"></script>
	<script src="https://cdn.bootcss.com/layer/2.3/layer.js"></script>
	<script type="text/javascript" src="../../plugins/layui/layui.js"></script>
	<script src="https://cdn.bootcss.com/axios/0.19.0/axios.min.js"></script>
	<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
	<script type="text/javascript" src="../../plugins/home/common.js"></script>
	<script type="text/javascript" src="../../scripts/home/yunhetong.js"></script>
	<script type="text/javascript" src="../../scripts/home/magerIndcInfo.js"></script>
	<style>
		.layui-upload-list {
			margin: 0px 60px;
		}
	</style>
</head>
<body>
<form class="layui-form" id="testForm">
	<div  id="app">
		<div class="layui-form-item">
			<label class="layui-form-label">法人姓名</label>
			<div class="layui-input-block">
				<input type="text" name="agentUserNm" v-model="agentUserNm" lay-verify="required|agentUserNm" autocomplete="off" class="layui-input" maxlength="11">
			</div>
		</div>
		<div class="layui-form-item">
			<!--<input type="hidden" id="custNm" name="custNm" lay-verify="custNm" title="管理人">
			<input type="hidden" id="crmMagerId" name="crmMagerId" title="CRM对应管理人ID">-->
			<label class="layui-form-label">证件类型</label>
			<div class="layui-input-block">
				<input type="hidden" id="certifyType" name="certifyType"/>
				<select name="cardType" id="cardType" lay-filter="cardTypeFilter"   lay-verify="required" v-model="cardType">
					<template  v-for="item in cardTypeList">
						<option :value="item.cKeyValue" v-if="item.cKeyValue == 'a'" selected="selected">{{item.cCaption}}</option>
						<option :value="item.cKeyValue" v-else  >{{item.cCaption}}</option>
					</template>
				</select>
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">证件号码</label>
			<div class="layui-input-block">
				<input type="text" name="cardNo" v-model="cardNo"  lay-verify="required" autocomplete="off" class="layui-input" maxlength="18">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">手机号码</label>
			<div class="layui-input-block">
				<input type="tel" name="agentMobileNo" v-model="agentMobileNo" lay-verify="required|phone|number" autocomplete="off" class="layui-input" maxlength="11">
			</div>
		</div>

		<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
			<legend>法定代表人/授权代表章</legend>
		</fieldset>

		<div class="layui-upload">
			<button type="button" class="layui-btn" id="test2">上传</button>
			<blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
				预览图：
				<div class="layui-upload-list" id="demo2"></div>
			</blockquote>
		</div>
		<div class="layui-form-item">
			<div class="layui-input-block">
				<a class="layui-btn" lay-submit="" lay-filter="demo1">认证</a>
			</div>
		</div>
	</div>
</form>

<script>

	//获取url参数caCustId
	var caCustId=getQueryVariable('caCustId');
	var agentUserId=getQueryVariable('agentUserId');
	var crmMagerId=getQueryVariable('crmMagerId');
	console.log("caCustId====================="+caCustId);
	console.log("agentUserId====================="+agentUserId);
    var domain=getDomain();
    var token=getLongToken();
    var extsArr='';
    var uploadInst='';//创建一个实例
    var operatorId=getCurrentLoginUser();//
	//法人章信息
    var fileId='';//文件id
    var fileName='';//文件名称
    var fileUrl='';//文件地址
    var localPath='';//本地地址
    var form='';
    var cardType='';//证件类型
    var resultData=null;
    layui.use(['upload','form'], function(){
         form = layui.form;
        var $ = layui.jquery
            ,upload = layui.upload;
        //多图片上传
        uploadInst=upload.render({
            elem: '#test2',
            accept: 'images' //只允许上传图片
            ,acceptMime: 'image/*' //只筛选图片
            ,size: 400 //限定大小
            ,exts: 'png' //只允许上传压缩文件
            ,data:{token:token,"operatorId":operatorId,"caCustId":agentUserId,"type":'G1'}
            ,url: domain+'/api/upload/faren'
            ,multiple: false
            ,before: function(obj){

                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                   // var obj= $("#prePic");
                    //if(obj){
                        //$("#prePic").remove();
					//}
                   // $('#demo2').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img">')
                });
            }
            ,done: function(res){
                //上传完毕
                var item = this.item;
                 fileId=res.data.fileId;
                 fileName=res.data.oriFileName;
                 fileUrl=res.data.fileUrl;
                localPath=res.data.localPath;
                 if(res.code!=0){
                     messageErrorInfo(res.message);
				 }else{
                     $("#prePic").remove();
                     $('#demo2').html('');
                     $('#demo2').append('<img src="'+ fileUrl +'" alt="'+ fileName +'" class="layui-upload-img">')
				 }
                console.log(JSON.stringify(res)); //获取当前触发上传的元素，layui 2.1.0 新增
            }
        });

        //监听提交
        form.on('submit(demo1)', function(data){
           // alert(JSON.stringify(data));
			console.log("表单数据==========="+JSON.stringify(data));
            //return ;
            var agentUserNm=data.field.agentUserNm;//法人姓名
            var certifyType=data.field.certifyType;//证件类型
            var certifyNum=data.field.cardNo;//证件号码
            //var crmMagerId=data.field.crmMagerId;
            var phoneNo=data.field.agentMobileNo;//手机号码
            var result=queryUserNo(certifyNum);
            console.log("queryUserNo..................返回结果"+JSON.stringify(result));
            var agentUserId="";//客户ID
            if(result.code==200){
                agentUserId=result.data[0];
                agentUserId=JSON.stringify(agentUserId);
                agentUserId=agentUserId.substring(1,agentUserId.length-1);
                agentUserId=agentUserId.split(":")[1];
			}else{
				//没有返回用户id，则调用创建个人用户接口
				var url=domain+'/api/v1/user/create';
				var dataParam={'userName':agentUserNm,'certifyType':certifyType,'certifyNum':certifyNum,'phoneNo':phoneNo};
				var resultData= sendMyAjaxPost(url,dataParam);
                console.log("调用创建个人用户接口..................返回结果"+JSON.stringify(resultData));
				if(resultData.code!=0){
                    messageInfo(resultData.message);
                    return false;
				}else{
                    agentUserId=resultData.data.signerId;
				}
			}
			console.log("caCustId=========================="+caCustId);
			//插入表MAGER_INDC_INFO
			//处理法人章信息
			var updateUrl=domain+"/api/v1/user/faren/update";
			console.log("处理法人章信息url===================="+updateUrl);
			var updateParam={'caCustId':caCustId,'agentUserNm':agentUserNm,'agentUserCertNo':certifyNum,'agentUserCertTyp':certifyType,'agentMobileNo':phoneNo,"agentUserId":agentUserId,'operatorId':operatorId,'fileName':fileName,'fileUrl':fileUrl,'fileId':fileId,'localPath':localPath,"token":token};
			console.log("处理法人章信息参数===================="+JSON.stringify(updateParam));
			var faRenInfoResult=sendMyAjaxPost(updateUrl,updateParam);
			console.log("处理法人章信息返回结果===================="+JSON.stringify(faRenInfoResult));
			if(faRenInfoResult.code==0){
				layer.alert("操作成功", {
					icon: 6,
					skin: 'layer-ext-moon' //该皮肤由layer.seaning.com友情扩展。关于皮肤的扩展规则，去这里查阅
				},function(){
				    parent.layer.closeAll(); //疯狂模式，关闭所有层
					parent.parentReload();
				})
			}else{
                messageErrorInfo(faRenInfoResult.message);
			}



        });
        //监听select
        form.on('select(cardTypeFilter)', function (data) {
            console.log("监听select。。。。。。。。。。。。。。。。。。。。");
			$("#certifyType").val(data.value);
        });
        //监听radio
        form.on('radio(rdo)', function (data) {
            console.log(JSON.stringify(data));
			var id=data.value;
			var name=$("#"+id).attr('data-name');
            $("#custNmH").html(name);
            $("#custNm").val(name);
            $("#crmMagerId").val(id);
        });
		if(''!=cardType&&cardType!='未知'){
            $("#cardType").val(cardType);
            $(".layui-unselect").val(cardType);
            $.each($("dl").find("dd"), function(i,val){
                var key=$(this).attr('lay-value');
                var text=$(this).html();
                if(cardType==text){
                    $(this).attr('class','layui-this');
                    $("#certifyType").val(key);
                }
            });
		}
        //自定义校验规则
        form.verify({
            agentUserNm: function(value, item){ //value：表单的值、item：表单的DOM对象
                if(''==value){
                    return '法人姓名不能全为空';
                }
                if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
                    return '法人姓名不能有特殊字符';
                }
                if(/(^\_)|(\__)|(\_+$)/.test(value)){
                    return '法人姓名首尾不能出现下划线\'_\'';
                }
                if(/^\d+\d+\d$/.test(value)){
                    return '法人姓名不能全为数字';
                }
            }
            //我们既支持上述函数式的方式，也支持下述数组的形式
            //数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
            ,pass: [
                /^[\S]{6,12}$/
                ,'密码必须6到12位，且不能出现空格'
            ],
            cardNumber:function(value,item){
                var type=$("#certifyType").val();
                if(type==1||type==2){
                    if(value.length!=18){
                        return "证件号码格式错误";
					}
				}else{
                    if(value.length!=9){
                        return "证件号码格式错误";
					}
				}
			}
              ,
            custNm:[
                /.*[^\s]/
                ,'请先选择管理人'
            ]
        });

    });

    new Vue({
        el: '#app',
        data () {
            return {
                cardTypeList: [],
                agentUserNm:'',
                agentMobileNo:'',
                cardType:'',
                agentAdd:'',
                agentNm:'',
                agentAdd:'',
                cardNo:''
            }
        },
        mounted () {
            var resultData=initData();
            console.log("返回结果======="+JSON.stringify(resultData));
            this.cardTypeList=resultData.cardTypeList;
            this.agentUserNm=resultData.info.agentUserNm;
            this.agentMobileNo=resultData.info.agentMobileNo;
            this.cardNo=resultData.info.agentUserCertNo;
            this.cardType=resultData.info.agentUserCertTyp;
            this.agentAdd=resultData.info.agentAdd;
            this.agentNm=resultData.info.agentNm;
            this.agentId=resultData.info.agentId;
            console.log("cardType======="+this.cardType);
            cardType=this.cardType;
             fileId=this.agentId;//文件id
             fileName=this.agentNm;//文件名称
             fileUrl= this.agentAdd;//文件地址
			if(this.agentAdd!=''){
                $('#demo2').append('<img id="prePic" src="'+  this.agentAdd +'"  class="layui-upload-img">');
			}

         }

    })
function initData(){
    var resultData='';
    $.ajax({
        url:domain+"/api/v1/magerIndcInfo/edite",    //请求的url地址
        dataType:"json",   //返回格式为json
        async:false,//请求是否异步，默认为异步，这也是ajax重要特性
        data:{"caCustId":caCustId,"crmMagerId":crmMagerId},    //参数值
        type:"post",   //请求方式
        beforeSend:function(){
            //请求前的处理
        },
        success:function(req){
            //请求成功时处理
            resultData=req.data;
        },
        complete:function(){
            //请求完成的处理
        },
        error:function(){
            //请求出错处理
        }
    });
    return resultData;
}
/*    window.uploadFile= function(){
        if(''==agentUserId){
            var url=domain+'/api/v1/user/create';
            var dataParam={'userName':agentUserNm,'certifyType':certifyType,'certifyNum':certifyNum,'phoneNo':phoneNo};
            var resultData= sendMyAjaxPost(url,dataParam);
            console.log("调用创建个人用户接口..................返回结果"+JSON.stringify(resultData));
            if(resultData.code!=0){
                messageInfo(resultData.message);
                return false;
            }else{
                agentUserId=resultData.data;
            }
		}
		uploadInst.reload({
            data:{token:token,"operatorId":operatorId,"caCustId":agentUserId,"type":'G1'}
		});
        $("#uploadBtn").click();
        //fileupload(type,id)
    }*/
</script>

</body>
</html>
